<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>OAProject</title>
<link rel="stylesheet" type="text/css"
	href="css/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="css/themes/icon.css">
		<link rel="stylesheet" type="text/css" href="css/demo/demo.css">
			<script type="text/javascript" src="js/jquery.min.js"></script>
			<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>

<body>
	<div style="margin: 0 0;"></div>
	<div class="easyui-layout" data-options="fit:true">
		<div data-options="region:'north'" style="height: 150px"></div>
		<div data-options="region:'south',split:true" style="height: 30px;">

		</div>
		<div data-options="region:'east',split:true" title="East"
			style="width: 15%;">
			<!-- <ul class="easyui-tree" data-options="url:t1.json',method:'get',animate:true,dnd:true"></ul>-->
		</div>
		<div data-options="region:'west',split:true"
			title="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--导航栏--"
			style="width: 16%; text-align: center">
			<div class="easyui-accordion" data-options="multiple:true,fit:true"
				style="margin: 0px 0 10px 0; width: 300px; height1: 300px;">
				<div title="公共信息" data-options="iconCls:'icon-ok'"
					style="overflow: auto; padding: 10px;">
					<ul id="t1" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="信息发布" style="padding: 10px;">
					<ul id="t2" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="办公流程" style="padding: 10px;">
					<ul id="t3" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="合同管理" style="padding: 10px;">
					<ul id="t4" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="文件管理" style="padding: 10px;">
					<ul id="t5" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="计划任务" style="overflow: auto; padding: 10px;">
					<ul id="t6" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="个人事务" style="padding: 10px;">
					<ul id="t7" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="信息交流" style="padding: 10px;">
					<ul id="t8" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="文件共享" style="padding: 10px;">
					<ul id="t9" class="easyui-tree" data-options="lines:true"></ul>
				</div>
				<div title="办公管理" style="padding: 10px;">
					<ul id="t10" class="easyui-tree" data-options="lines:true"></ul>
				</div>
			</div>
		</div>
		<div id="tt"
			data-options="region:'center',title:'主功能区',iconCls:'icon-ok'">
			<div region="center" border="false" border="false">
				<div id="tab1" class="easyui-tabs"
					data-options="fit:true,border:false" style="width: auto;"></div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function indexbutton() {
			document.getElementById("indexout").innerHTML = document.getElementById('indexmessage').value
		}
        $(document).ready(function(){
              $('#t1').tree({
                url:'../json/t1.json',
                method:'get'
              });
              $('#t2').tree({
                url:'../json/t2.json',
                method:'get'
              });
              $('#t3').tree({
                url:'../json/t3.json',
                method:'get'
              });
              $('#t4').tree({
                url:'../json/t4.json',
                method:'get'
              });
              $('#t5').tree({
                url:'../json/t5.json',
                method:'get'
              });
              $('#t6').tree({
                url:'../json/t6.json',
                method:'get'
              });
              $('#t7').tree({
                url:'../json/t7.json',
                method:'get'
              });
              $('#t8').tree({
                url:'../json/t8.json',
                method:'get'
              });
              $('#t9').tree({
                url:'../json/t9.json',
                method:'get'
              });
              $('#t10').tree({
                url:'../json/t10.json',
                method:'get'
              });

              $('.easyui-tree').tree({
                onClick:function(node){
                    if (node.attribute && node.attribute.url) {
                       <!-- var exists = $('#tab1'）.tabs('exsits',node.text);-->
						var exists = $('#tab1').tabs('exists', node.text); //判断tab是否存在
						$('#tab1').tabs(exsits ? 'select' : 'add',exsits ? node.text:{ title:node.text,href:node.attributes.url,closable:true});
                    }else{
                        alert('哈哈哈哈！');
                    };
                }
              });
            });
    </script>
</body>
</html>
